import { Suspense } from 'react';
// 导入客户端组件
import ArticleDetailContent from './ArticleDetailContent';

// 为静态导出提供路由参数
export function generateStaticParams(): { id: string }[] {
  // 返回一个包含id参数的数组，即使是空的，也需要正确的格式
  // 在实际项目中，这里可以返回实际的文章ID列表
  // 包含所有可能的文章ID，包括40
  return [
    { id: '1' }
  ];
}

// 这是服务器组件，负责处理动态路由
export default async function ArticleDetailPage({ params }: { params: Promise<{ id: string }> }) {
  // 在服务器组件中，params是一个Promise，必须使用await解包
  const { id } = await params;
  
  return (
    <div className="container mx-auto px-4 py-8">
      <Suspense fallback={<div className="flex items-center justify-center min-h-screen"><p>加载中...</p></div>}>
        <ArticleDetailContent id={id} />
      </Suspense>
    </div>
  );
}